<template>
  <div>
    <el-tag type="success">PhysToInternal (0..1)</el-tag>
    <div class="right">
      <el-button @click="deleteMode">删除</el-button>  
    </div>
  </div>
  <el-form :inline="true" :model="formInline" class="demo-form-inline">
    <el-form-item label="Int= " style="margin: 5px">
      <el-input
        v-model="form.physToInternalFactor"
        placeholder="因子"
      ></el-input>
    </el-form-item>
    <el-form-item label="+ physical * " style="margin: 5px">
      <el-input
        v-model="form.physToInternalScaleFactor"
        placeholder="比例系数"
        >/</el-input
      >
    </el-form-item>
    <el-divider
      class=""
      style="margin: 0px; border: 40 dashed #987cb9"
    ></el-divider>

    <el-form-item label=" " style="margin-left: 100px; margin-top: 5px">
      <el-input
        v-model="form.physToInternalDenominator"
        placeholder="分母"
        >/</el-input
      >
    </el-form-item>
    <div>
      <el-form-item label="Up Limit">
        <div style="width: 200px">
          <el-input
            v-model="form.physToInternalUpperLimit"
          ></el-input>
        </div>
      </el-form-item>
      <el-form-item label="Lower Limit">
        <div style="width: 200px">
          <el-input
            v-model="form.physToInternalLowerLimit"
          ></el-input>
        </div>
      </el-form-item>
    </div>

    <el-divider></el-divider>
     <el-form-item>
      <el-button type="primary" @click="phyToInt">物理值转换内部值 保存</el-button>
    </el-form-item>
  </el-form>
</template>

<script  lang="ts">
import { defineComponent, ref, computed } from 'vue'
import ScaleLinearVue from '../compu-method/scale-linear.vue'
import { toRefs, defineProps, defineEmits } from 'vue'
import { reactive } from 'vue'
import { inject } from 'vue'
import { toRaw } from '@vue/reactivity'
export default defineComponent({
  components: {},
  props: {
    info: Number, // 这里需要标定父组件传过来的类型是什么 布尔 数组 对象等等等等,
    itemPI: Array,
    money: {
      type: Number,
      default: 0
    }
  },

  setup(props, { emit }) {
   
    const itemLinear = ref([
      {
        physToInternalFactor: 11,
        physToInternalScaleFactor: 10,
        physToInternalDenominator: 5,
        physToInternalUpperLimit: 3.0,
        physToInternalLowerLimit: 10.0,
      }
    ])
    const { info } = toRefs(props)
    const { itemPI } = toRefs(props)
    // const emits = defineEmits(["props"]);
    const deleteMode = () => { 
      //   emits('props', props)
      console.log({ itemPI }.itemPI.value)
      console.log({ info }.info.value)
      //  toRaw({itemPI}.itemPI.value)
      console.log(
        toRaw({ itemPI }.itemPI.value)?.splice(0, { info }.info.value)
      )
      console.log(toRaw({ itemPI }.itemPI.value))
       
     
    }
     
    return {
   
      itemLinear,
      deleteMode,
       

    }
  },
  data() {
    return {
      form: {
        physToInternalFactor: 11,
        physToInternalScaleFactor: 10,
        physToInternalDenominator: 5,
        physToInternalUpperLimit: 3.0,
        physToInternalLowerLimit: 10.0,
      }
    }
  },methods: {
    phyToInt(){
    this.$emit('phyToInt', this.form)
    //告诉父组件事件以及传递的参数
    }
  }
})
</script>

<style>
.right {
  position: relative;
  left: 500px;
  top: -40px;
  /* width: 50px; */
  /* margin: 20px; */
  /* border: 3px solid #73AD21; */
  /* padding: 10px; */
}
.xuanfu {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
}
</style>>